<template>
  <div id="tpl">
    <ul class="mui-table-view mui-table-view-chevron">
      <li v-for="(item,index) in list" :key="index" class="mui-table-view-cell mui-media">
				<router-link v-bind='{to:"/news/newsDetail/"+item.id}'>
					<img class="mui-media-object mui-pull-left" :src="item.img_url">
					<div class="mui-media-body">
						<p>{{item.title}}</p>
						<p class="foot"><span class="add-time">发表时间：{{item.add_time | dateFmt('YYYY-MM-DD HH:mm:ss')}}</span><span class="click">点击：{{item.click}}</span></p>
					</div>
				</router-link>
			</li>
		</ul>
  </div>
</template>

<script>
	import {Toast} from 'mint-ui';
  import common from '../../kits/common.js';
  export default {
    data(){
      return {
        list: []
      }
    },
    created(){
      this.getNewslist();
    },
    methods: {
      getNewslist: function(){
        // var url = 'http://182.254.146.100:8899/api/getnewslist';
        var url = common.apidomain + '/api/getnewslist';
        this.$http.get(url)
                  .then(function(res){
                    if(res.body.status != 0){ // 失败
                      Toast(res.body.message);
                      return;
                    }
                    this.list = res.body.message;
                  });
      }
    }
  }
</script>

<style scoped>
	.mui-table-view .mui-media-object {
		max-width: 60px;
		width: 60px;
		height: 60px;
		line-height: 60px;
	}
.mui-table-view-chevron .mui-table-view-cell {
  padding-right: 15px;
}
.mui-table-view-chevron .mui-table-view-cell>a:not(.mui-btn) {
  margin-right: -15px;
}
.mui-table-view-cell>a:not(.mui-btn) {
  white-space: normal;
}
.foot {
	position: absolute;
	bottom: 5px;
	left: 0;
	padding-left: 85px;
	padding-right: 15px;
	width: 100%;
}
.add-time {
  float: left;
  color: #26a2ff;
}
.click {
  float: right;
  color: #26a2ff;
}
</style>
